<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="maximum-scale=1,minimum-scale=1,user-scalable=0,width=device-width,initial-scale=1">
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>{$set['title']}</title>
    <link rel="stylesheet" href="../addons/junsion_wxtools/template/mobile/css/index.css?v=1111" />
    <link rel="stylesheet" href="../addons/junsion_wxtools/template/mobile/css/swiper.css">
    <style type="text/css">
    .banner{
    	height: 100%;
    }
    .banner img{
    	width: 100%;
    	height: 100%;
    }
    .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{
    	bottom: 25px;
    }
    </style>
  </head>
  <body>
    <div class="container">
      <div class="bgbox pr">
        
	     <div class="banner swiper-container">
	      <div class="swiper-wrapper">
	      {loop $adv $a}
	       <div class="swiper-slide">
	        <a {if $a['link']}href='{$a['link']}'{/if}><img src="{php echo toimage($a['pic'])}" class="banner-img" /></a>
	       </div>
	       {/loop}
	      </div> 
	      <div class="swiper-pagination swiper-pagination-bullets">
	       {loop $adv $a}
	       <span class="swiper-pagination-bullet"></span>
	       {/loop}
	      </div>
	      </div>
        <div class="middleBox pa">
          <div class="rank_txt gray1 fontsize26">
            <div class="ranktext">排行</div>
            <div class="usernick">用户昵称</div>
            <div class="score">积分</div>
          </div>
          <div class="color_block white1">
            <div class="rank_txt1 fontsize30">
              <div class="ranknum">{$mem['rank']}</div>
              <div class="avaImg">
                <img src="{$mem['avatar']}" alt="" />
              </div>
              <div class="username">{$mem['nickname']}</div>
              <div class="score_num">{$mem['credit1']}</div>
            </div>
          </div>
          <div class="lists fontsize14">
          	{loop $list $k $l}
            <div class="lists_Item">
              <div class="listItemLeft">
              {if $k < 3}
                <div class="rankIcon">
                  <img src="../addons/junsion_wxtools/template/mobile/image/{if $k==0}first{else if $k==1}second{else if $k==2}third{/if}@2x.png" alt="" />
                </div>
                {else}
                <div class="rankIcon1">
                  {php echo $k+1}
                </div>
                {/if}
                <div class="avatarIcon">
                  <img src="{$l['avatar']}" alt="" />
                </div>
                <div class="rankName">{$l['nickname']}</div>
              </div>
              <div class="rankTime gray">{$l['credit1']}</div>
            </div>
            {/loop}
          </div>
        </div>
      </div>

      <div class="btnbox white">
        <div class="leftbtn ">入口1</div>
        <div class="rightbtn">入口2</div>
      </div>
    </div>
<script type="text/javascript" src="../addons/junsion_wxtools/template/mobile/js/jquery-1.10.1.min.js"></script>
<script type="text/javascript" src="../addons/junsion_wxtools/template/mobile/js/swiper.min.js"></script>
<script>
var mySwiper = new Swiper('.banner', {
	autoplay: 2500,
    loop: true,
    pagination: {
        el: '.swiper-pagination',
    }
});

{if count($list) >= 10}
var page = 1;
//下拉加载
var range = -80; //距下边界长度/单位px
var totalheight = 0;
var loading = false;
$(window).scroll(function(){
  if(loading) return false;
 //真实内容的高度
  var pageHeight = Math.max(document.body.scrollHeight,document.body.offsetHeight);
  //视窗的高度
  var viewportHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight || 0;
  //隐藏的高度
  var scrollHeight = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0;
   if(pageHeight - viewportHeight - scrollHeight < 10){  //如果满足触发条件，执行
    	if(loading) return false;
		page++;
		getList();
    }
});
function getList(){
	if(loading) return false;
	loading = true;
	$.ajax({
		url: "{php echo $this->createMobileUrl('scorerank')}",
		data: {page:page},
		type: "post",
		success: function(dat){
			dat = JSON.parse(dat);
			if(dat.status==1){
				$.each(dat.list,function(k,v){
					var str = '';
					str += '<div class="lists_Item">';
					str += '<div class="listItemLeft">';
					str += '<div class="rankIcon1">'+parseInt($('.lists_Item').length + 1);
					str += '</div>';
					str += '<div class="avatarIcon">';
					str += '<img src="'+v['avatar']+'"/>';
					str += '</div>';
					str += '<div class="rankName">'+v['nickname']+'</div>';
					str += '</div>';
					str += '<div class="rankTime gray">'+v['credit1']+'</div>';
					str += '</div>';
					$('.lists').append(str);
				})
				loading = false;
			}
			else{
				loading = true;
			}
		}	
	});	
}
{/if}
</script>
  </body>
</html>
